document.addEventListener('DOMContentLoaded', function() {
    // 加载应用数据
    fetch('/static/data/apps.json')
        .then(response => response.json())
        .then(data => {
            renderCategories(data.categories);
            renderApps('featured', data.featured);
            renderApps('latest', data.latest);
        })
        .catch(error => console.error('Error loading apps:', error));
});

// 渲染分类列表
function renderCategories(categories) {
    const container = document.querySelector('.list-group');
    container.innerHTML = '';

    categories.forEach((category, index) => {
        const item = document.createElement('a');
        item.href = '#';
        item.className = `list-group-item list-group-item-action d-flex align-items-center ${index === 0 ? 'active' : ''}`;
        item.innerHTML = `
            <i class="${category.icon} me-2"></i>
            ${category.name}
            <span class="badge bg-primary ms-auto">${category.count}</span>
        `;
        container.appendChild(item);
    });
}

// 渲染应用列表
function renderApps(section, apps) {
    const container = document.querySelector(`[data-section="${section}"]`);
    if (!container) return;

    container.innerHTML = '';
    
    apps.forEach(app => {
        const col = document.createElement('div');
        col.className = 'col';
        col.innerHTML = `
            <div class="card h-100">
                <div class="position-relative">
                    <img src="${app.image}" class="card-img-top" alt="${app.name}">
                </div>
                <div class="card-body">
                    <h6 class="card-title">${app.name}</h6>
                    <p class="card-text text-muted small">${app.description}</p>
                    <div class="d-flex justify-content-end">
                        <button class="btn btn-primary btn-sm" onclick="installApp('${app.id}')">
                            <i class="fas fa-download me-1"></i>安装
                        </button>
                    </div>
                </div>
            </div>
        `;
        container.appendChild(col);
    });
}

// 安装应用
function installApp(appId) {
    console.log('Installing app:', appId);
    // TODO: 实现应用安装逻辑
} 